<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" href="../css/login.css">
    <link rel="stylesheet" href="../css/bootstrap.min.css">
</head>
<body>
    <div class="outer">
        <div class="backg">
            <img class="img1" src="../img/epet-logo.png" alt="">
            <div class="text">
                E宠商城欢迎您的登录！！！
            </div>
        </div>
        
        <div class="box">
            <p>
                用户登录
            </p>
            <img src="../../../SecondWeek/011 7.24/work/img/1.jpg" alt="">
            <form action="">
                <input class="usn" type="text" placeholder="账号"><span class="sp1"></span><br>
                <input class="psw" type="password" placeholder="密码"><span class="sp2"></span><br>
                <div class="inner">
                    <input type="checkbox">自动登录
                    <input type="checkbox">记住密码
                    <input type="checkbox">找回密码
                </div>
                <input class="btn" type="submit" value="登录">
            </form>
        </div>
    </div>
    <script>
        var oForm = document.querySelector("form");
        var oInput  = document.querySelectorAll("input");
        var oSpan  = document.querySelectorAll("span");
        oForm.onsubmit = function(){
            if(oInput[0].value ==""){
                oSpan[0].innerHTML = "此处不能为空"
                return false;
                
            }
            if(oInput[1].value ==""){
                oSpan[1].innerHTML = "此处不能为空"
                return false;
            }
            return false;
        }
    </script>
    
    <script src="../js/jquery-1.11.0.js"></script>
    <script src="../js/login.js"></script>
</body>
</html>